import { _decorator, Component, Color, error, Sprite } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('BackgroundColorChanger')
export default class SmoothColorGradient extends Component {
    //    // 12个固定颜色，hex格式
    @property([Color])
    colors: Color[] = [
        new Color().fromHEX("#FFB3BA"), // 柔粉红
        new Color().fromHEX("#FFC9B9"), // 浅橙粉
        new Color().fromHEX("#FFDFBA"), // 杏橙
        new Color().fromHEX("#FFFFBA"), // 淡黄
        new Color().fromHEX("#E2FFBA"), // 柠檬绿
        new Color().fromHEX("#BAFFC9"), // 薄荷绿
        new Color().fromHEX("#BAFFE2"), // 浅青绿
        new Color().fromHEX("#BAF3FF"), // 浅天蓝
        new Color().fromHEX("#BAE1FF"), // 淡蓝
        new Color().fromHEX("#D3BAFF"), // 淡紫
        new Color().fromHEX("#E0BAFF"), // 浅粉紫
        new Color().fromHEX("#FFBAF3"), // 樱花粉
    ];
    //    // 渐变速度，颜色切换次数/秒，默认0.08比较慢
    @property
    speed: number = 0.08;
    private _time: number = 0;
    onLoad() {
        if (this.colors.length < 2) {
            error("至少需要两个颜色进行渐变");
            this.enabled = false;
        }
    }
    update(dt: number) {
        this._time += dt;
        const color = this.getSmoothGradientColor(this._time, this.speed);
        // 给节点设置颜色，可以改成你需要的目标组件颜色设置方式
        this.node.getComponent(Sprite).color = color;
    }
    //    // sin平滑缓动
    private smoothSin(t: number): number {
        return 0.5 - 0.5 * Math.cos(Math.PI * t);
    }
    //    // 线性插值
    private lerp(a: number, b: number, t: number): number {
        return a + (b - a) * t;
    }
    // //    // 颜色插值
    // private lerpColor(c1: Color, c2: Color, t: number): Color {
    //     const r = Math.round(this.lerp(c1.getR(), c2.getR(), t));
    //     const g = Math.round(this.lerp(c1.getG(), c2.getG(), t));
    //     const b = Math.round(this.lerp(c1.getB(), c2.getB(), t));
    //     return new Color(r, g, b);
    // }

    // 颜色插值
    private lerpColor(c1: Color, c2: Color, t: number): Color {
        const r = Math.round(this.lerp(c1.r, c2.r, t));
        const g = Math.round(this.lerp(c1.g, c2.g, t));
        const b = Math.round(this.lerp(c1.b, c2.b, t));
        const a = Math.round(this.lerp(c1.a, c2.a, t)); // 别忘了透明度
        return new Color(r, g, b, a);
    }

    //    /**
    //     * 根据时间获取渐变颜色
    //     * @param time 当前时间（秒）
    //     * @param speed 渐变速度（颜色块每秒经过数）
    //     */
    private getSmoothGradientColor(time: number, speed: number): Color {
        const total = this.colors.length;
        const totalDuration = total / speed; // 整个循环时间（秒）
        const progress = (time % totalDuration) * speed; // 当前循环位置，0 ~ total

        const index = Math.floor(progress) % total;
        const nextIndex = (index + 1) % total;

        let t = progress - index;
        t = this.smoothSin(t);

        const c1 = this.colors[index];
        const c2 = this.colors[nextIndex];

        return this.lerpColor(c1, c2, t);
    }
}